<style scoped lang="scss">
.dl1{
  display: flex;
  justify-content: end;
  align-items: center;
  line-height: 20px;
  // border: 1px solid #ccc;
  dd{
    padding-right: 20px;
  }
}
</style>
<template>
    <div>
        <dl v-for="(item,index) in recordData" :key="index" class="dl1">
          <dd>
            <p>{{ item.content }}</p>
          </dd>
          <dt>
            <img style="width: 50px;height: 50px;border-radius: 50%;" :src="item.doctorHeadPic" alt="">
          </dt>
        </dl>
    </div>
</template>
<script setup lang="ts">
// 引入获取聊天记录的接口
import { getRecord } from '@/api/homeapi/index'
// 引入ref函数
import { reactive, ref } from 'vue';
// 引入useRoute函数
import { useRoute } from 'vue-router';
// 使用useRoute函数获取路由信息
const route = useRoute()
// 使用ref函数创建一个响应式变量，用于存储聊天记录id
const recordId = ref(route.query.recordId)
// 打印聊天记录id
console.log(recordId.value);
// 获取医生id和sessionId
const doctorId:any = localStorage.getItem('doctorId')
const sessionId = JSON.parse(localStorage.getItem('sessionId') as string)

const page = ref(1)
const count = ref(10)
const configs = reactive({
    recordId: recordId,
    page: page,
    count: count
})
const recordData:any = ref([])
// 调用获取聊天记录的接口，传入医生id、sessionId和配置信息
getRecord(doctorId, sessionId, configs).then(res => {
    console.log(res);
    recordData.value=res.data.result
})
</script>